<extend name="Public/base"/>

<block name="body">
	<div class="am-cf am-u-md-12 header-title">
		<h2>栏目点击率</h2>
	</div>
    
    <form  method="post" name="form" id="form">
    
<table width="814" border="0" align="center" cellpadding="0" cellspacing="0">
  <tbody>
    <tr>
      <td>起始日期</td>
      <td><input name="addtime" type="text" id="addtime"></td>
      <td>终止日期</td>
      <td><input name="validity" type="text" id="validity"></td>
      <td>&nbsp;</td>
      <td><input type="submit" name="submit" id="submit" value="搜索"></td>
    </tr>
  </tbody>
</table>
</form>

<script type="text/javascript" src="__PUBLIC__/home/js/jquery-1.11.0.min.js"></script>

	<link type="text/css" rel="stylesheet" href="__PUBLIC__/home/css/admin.css" />

	<link rel="stylesheet" type="text/css" href="__PUBLIC__/home/css/jquery-ui.css" />

	<script type="text/javascript" src="__PUBLIC__/home/js/jquery-ui-1.10.4.custom.min.js"></script>

	<script type="text/javascript" src="__PUBLIC__/home/js/jquery.ui.datepicker-zh-CN.js"></script>

	<script type="text/javascript" src="__PUBLIC__/home/js/jquery-ui-timepicker-addon.js"></script>

	<script type="text/javascript" src="__PUBLIC__/home/js/jquery-ui-timepicker-zh-CN.js"></script>
	
 <script type="text/javascript">$( "input[name='addtime'],input[name='validity']" ).datetimepicker();</script>
	

	<!-- 表格列表 -->
	<div class="am-cf am-u-md-12 am-margin-top">
		<div class="category">
			<div class="hd am-cf">
				<div class="lmm">栏目名称</div>
				<div class="zts">总条数</div>
				<div class="zdjl">总点击率</div>
				<div class="djl">平均点击率</div>
				
			</div>
            <ul>
            <volist name="Category" id="item">
            <li class="tiao">
            <div class="lmm">{$item.title}</div>
				<div class="zts">{$item[count][count]}</div>
				<div class="zdjl">
					<php>
						if($item[count][view]){
							echo $item[count][view];
						}else{
							echo 0;
						}
					</php>
				</div>
				<div class="djl">
					<php>
						if($item[count][view]){
							echo round($item[count][view]/$item[count][count],2);
						}else{
							echo 0;
						}
					</php>
				</div>
				
            </li>
            	</volist>
            </ul>
		
		</div>
	</div>
	<!-- /表格列表 -->
</block>

<block name="script">
	<script type="text/javascript">
		(function($){
			/* 分类展开收起 */
			$(".category dd").prev().find(".fold i").addClass("icon-unfold")
				.click(function(){
					var self = $(this);
					if(self.hasClass("icon-unfold")){
						self.closest("dt").next().slideUp("fast", function(){
							self.removeClass("icon-unfold").addClass("icon-fold");
						});
					} else {
						self.closest("dt").next().slideDown("fast", function(){
							self.removeClass("icon-fold").addClass("icon-unfold");
						});
					}
				});

			
			/* 实时更新分类信息 */
			$(".category")
				.on("submit", "form", function(){
					var self = $(this);
					$.post(
						self.attr("action"),
						self.serialize(),
						function(data){
							/* 提示信息 */
							var name = data.status ? "success" : "error", msg;
							msg = self.find(".msg").addClass(name).text(data.info)
									  .css("display", "inline-block");
							setTimeout(function(){
								msg.fadeOut(function(){
									msg.text("").removeClass(name);
								});
							}, 1000);
						},
						"json"
					);
					return false;
				})
                .on("focus","input",function(){
                    $(this).data('param',$(this).closest("form").serialize());

                })
                .on("blur", "input", function(){
                    if($(this).data('param')!=$(this).closest("form").serialize()){
                        $(this).closest("form").submit();
                    }
                });
		})(jQuery);
	</script>
</block>
